<template>
  <div class="container">
    <xy-table ref="table" :api="api" :columns="columns">
      <template #addItem>
        <search-header :model="args" :on-search="onSearch"> </search-header>
      </template>
      <template #operationButton="{ scope }">
        <span v-if="scope.row.CheckStatus === 1" hidden></span>
        <template v-else>
          <el-button type="text" size="mini" @click="onCheck(scope.row)">
            {{ $language.local("Check") }}
          </el-button>
        </template>
      </template>

      <template #appendButton="{ row }">
        <template v-if="row.CheckStatus == 1">
          <el-button type="text" size="mini" @click="onSendSms(row)">
            {{ $language.local("发送短信") }}
          </el-button>
          <el-button type="text" size="mini" @click="showEditSignDialog(row)">
            {{ $language.local("签约率") }}
          </el-button>
          <el-button type="text" size="mini" @click="onSetPayChannel(row)">
            {{ $language.local("通道设置") }}
          </el-button>
        </template>
      </template>
    </xy-table>
    <el-dialog
      :title="$language.local('通道设置')"
      :visible.sync="payChannelVisible"
      width="40%"
      :close-on-click-modal="false"
      :destroy-on-close="true"
    >
      <el-form
        ref="payChannelRef"
        :model="payChannelData"
        :rules="$rules"
        label-width="100px"
        status-icon
      >
        <el-form-item :label="$language.local('ServiceName')" prop="sid">
          <select-service v-model="payChannelData.sid"></select-service>
        </el-form-item>
        <el-form-item :label="$language.local('启用通道')">
          <el-switch
            v-model="payChannelData.OpenStatus"
            active-value="0"
            inactive-value="1"
          >
          </el-switch>
        </el-form-item>
      </el-form>
      <span slot="footer" class="dialog-footer">
        <el-button @click="payChannelVisible = false">{{
          $language.local("取消")
        }}</el-button>
        <el-button type="primary" @click="onSubmit('payChannelRef')">{{
          $language.local("确定")
        }}</el-button>
      </span>
    </el-dialog>
    <el-dialog
      :title="$language.local('签约率设置')"
      :visible.sync="editSignDialogVisible"
      width="40%"
      :close-on-click-modal="false"
      :destroy-on-close="true"
    >
      <el-form
        ref="SignatureRateRef"
        :model="SignatureRateData"
        :rules="$rules"
        label-width="100px"
        status-icon
      >
        <el-form-item :label="$language.local('EmpSignatureRate')">
          <xy-rate
            disabled
            v-model="SignatureRateData.EmpSignatureRate"
          ></xy-rate>
        </el-form-item>
        <el-form-item
          :label="$language.local('SignatureRate')"
          prop="SignatureRate"
        >
          <xy-rate v-model="SignatureRateData.SignatureRate"></xy-rate>
        </el-form-item>
        <el-form-item
          :label="$language.local('isAuthorizeSign')"
          prop="isAuthorizeSign"
          label-width="200px"
        >
          <el-switch
            v-model="SignatureRateData.isAuthorizeSign"
            :active-value="0"
            :inactive-value="1"
          ></el-switch>
        </el-form-item>
      </el-form>
      <span slot="footer" class="dialog-footer">
        <el-button @click="editSignDialogVisible = false">{{
          $language.local("取消")
        }}</el-button>
        <el-button type="primary" @click="onSubmit('SignatureRateRef')">{{
          $language.local("确定")
        }}</el-button>
      </span>
    </el-dialog>
    <el-dialog
      :title="titleDlg"
      :close-on-click-modal="false"
      :destroy-on-close="true"
      width="86%"
      :visible.sync="addDialogVisible"
    >
      <merchant-detail
        :onCancel="onCancel"
        :model="formData"
        :apiName="apiName"
        :id="merchantId"
        @cancel="onCancel"
      ></merchant-detail>
    </el-dialog>
  </div>
</template>

<script>
import API from "../../plugins/api";
import MerchantDetail from "./MerchantDetail.vue";
export default {
  inject: ["reload"],
  components: {
    "merchant-detail": MerchantDetail,
  },
  data() {
    return {
      api: new API("/api/MerchantCheck/"),
      columns: {
        customerName: "上海xxx公司",
        merchant_number: "YJS000118",
        customLegalPerson: "小铭",
        customCollectorPhone: "12100001111",
        customerManager: "",
        SignatureRate: "",
        // customTaxIdcd: "91GAV12346",
        // IdNumber: "",
        // customCollector: "小先生",
        // areaName: "上海市杨浦区xxx",

        // Indate: "2021-02-23T00:00:00",
        // PayChannel: "",
        CheckStatus: 1,
        // InviteCode: "000118",

        // SignatureRate: 50,
        // EmpSignatureRate: 0,
        // registeredcapital: "",
        // registereddate: "",
        // BusinessScope: "",
      },
      payChannelVisible: false,
      payChannelData: {
        sid: "",
        OpenStatus: "0",
      },
      editSignDialogVisible: false,
      SignatureRateData: {
        SignatureRate: 50,
        EmpSignatureRate: 0,
      },
      args: {
        CheckStatus: "",
      },
      titleDlg: "审核",
      addDialogVisible: false,
      formData: {},
      merchantId: "",
      apiName: "",
    };
  },
  methods: {
    onSearch(e) {
      // this.params = e;
      console.log(e);
      console.log(this.$refs.table);
      this.$refs.table.getData(e);
    },
    async handleCheck(row) {
      let action = "Check";
      let apiName = "/api/MerchantCheck/Check";
      // window.sessionStorage.setItem(action, JSON.stringify(row));
      this.$router.push({
        name: "客户信息",
        query: { action, apiName, merchantId: row.Id },
      });
    },
    async onSendSms(row) {
      let res = await this.$confirm(
        "此操作将给客户发送开户通知短信, 是否继续?",
        "提示",
        {
          type: "warning",
        }
      ).catch((err) => err);
      console.log(row);

      if (res != "confirm") {
        return;
      }
      await this.$http.post(`/api/MerchantCheck/SendSms`, {
        mid: row.Id,
      });
      this.$message.success("发送短信成功");
    },
    onSetPayChannel(row) {
      this.payChannelVisible = true;
      this.payChannelData.mid = row.Id;
    },
    async setPayChannel() {
      let response = await this.$http.post(
        "/api/MerchantCheck/SetPayChannel",
        "",
        this.payChannelData
      );
      if (response.data.Code == 200) {
        this.payChannelVisible = false;
        this.$message.success("设置成功");
        this.reload();
      }
    },
    async setSignRate() {
      let { Id, SignatureRate, isAuthorizeSign } = this.SignatureRateData;
      let response = await this.$http.post(
        `/api/MerchantCheck/SetSignRate/${Id}?SignatureRate=${SignatureRate}&isAuthorizeSign=${isAuthorizeSign}`
      );
      if (response.data.Code == 200) {
        this.payChannelVisible = false;
        this.$message.success("设置成功");
        this.reload();
      }
    },
    onSubmit(formName) {
      this.$refs[formName].validate(async (valided) => {
        if (!valided) {
          return;
        }
        switch (formName) {
          case "payChannelRef":
            this.setPayChannel();
            break;
          case "SignatureRateRef":
            this.setSignRate();
            break;
          default:
            break;
        }
      });
    },
    showEditSignDialog(row) {
      this.SignatureRateData = row;
      console.log(this.SignatureRateData);
      this.editSignDialogVisible = true;
    },
    onCheck(row) {
      console.log(row);
      this.apiName = `/api/MerchantCheck/Check/${row.Id}`;
      // this.formData = { ...row };
      this.merchantId = row.Id;
      this.addDialogVisible = true;
    },
    onCancel() {
      this.addDialogVisible = false;
      this.reload();
    },
  },
};
</script>

<style></style>
